<template>
    <div>
        <el-dialog width="30%"  :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false" :center="true" v-model="dialogVisible" title="生成答题报告中">
            <div><el-progress :percentage="progress" /></div>
        </el-dialog>
    </div>
</template>

<script>
    import {ref,watch} from 'vue'
    export default {
        name: "index",
        props:{
            dialogVisible:{
                type:Boolean,
                default:{}
            }
        },
        setup(props,{emit}){
            let progress = ref(0);
            watch(() => props.dialogVisible,() =>{
                if(props.dialogVisible){
                    let timer = setInterval(() =>{
                        progress.value +=2
                    },100)
                    watch(() =>progress.value,() =>{
                        if(progress.value == 100){
                            console.log('完成')
                            clearInterval(timer);
                            emit('dialogEnd',false)
                        }
                    })
                }
            })
            return{
                progress
            }
        }
    }
</script>

<style scoped>

</style>
